{% extends('layout.html') %}
{% block body %}
<section id="tabs-bar" class="tabsbar">
    <div class="container">
        <div class="row">
            <div class="col s12 m12 l12 xl12">
                <ul class="tabs">
                    <li class="tab col s3 m3 l4 xl2"><a {% if tab=='1' %} class="active" {% endif %} href="#logging"
                            onclick="activeTab(1)">Logging</a></li>
                </ul>
            </div>
        </div>
    </div>
</section>
<section id="logging">
    <div class="container">
        <div class="row row-flex">
            <div class="col s12 m2"></div>
            <div class="col s12 m4">
                <div class="card-panel card-panel-eql z-depth-2">
                    <h4 class="red-text">Logging</h4>
                    <form action="/settings/logging" method="POST">
                        <input type="hidden" name="tab" value="1">
                        <div class="row">
                            <div class="input-field col s12 m12">
                                <select name="log_length" id="">
                                    <option value="30" {% if logging_settings['logging']['length']==30 %} selected
                                        {% endif %}>30</option>
                                    <option value="45" {% if logging_settings['logging']['length']==45 %} selected
                                        {% endif %}>45</option>
                                    <option value="60" {% if logging_settings['logging']['length']==60 %} selected
                                        {% endif %}>60</option>
                                    <option value="90" {% if logging_settings['logging']['length']==90 %} selected
                                        {% endif %}>90</option>
                                </select>
                                <label for="log_length">Length (Days)</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="input-field col s12 m12">
                                <select name="log_level" id="">
                                    {% for level in logging_settings['logging']['log_levels'] %}
                                    {% set level_num = loop.index - 1 %}
                                    {% if logging_settings['logging']['level']==level_num %}
                                    <option value="{{level_num}}" selected>{{level_num}}: {{level}}</option>
                                    {% else %}
                                    <option value="{{level_num}}">{{level_num}}: {{level}}</option>
                                    {% endif %}
                                    {% endfor %}
                                </select>
                                <label for="log_level">Log Level (Severity)</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="input-field col s12 m4 center"></div>
                            <div class="input-field col s12 m4 center">
                                <input type="hidden" name="logging_update">
                                <button class="btn waves-effect waves-light col s12">
                                    <i class="material-icons"></i> Update
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="col s12 m4">
                <div class="card-panel card-panel-eql z-depth-2">
                    <h4 class="red-text">Select Time Offset</h4>
                    <h6>System Time: {{logging_settings['system']}}</h6>
                    <h6>Time Offset: {{logging_settings['local']}}</h6>
                    <br>
                    <form action="/settings/logging" method="POST">
                        <input type="hidden" name="tab" value="2">
                        <div class="row">
                            <div class="input-field col s6 m6">
                                <select name="dir_offset" id="">
                                    <option value=" " {% if logging_settings['offset']['amount']==0 %} selected
                                        {% endif %}></option>
                                    <option value="-" {% if logging_settings['offset']['direction']=='-' and not
                                        logging_settings['offset']['amount']==0 %} selected {% endif %}>-</option>
                                    <option value="+" {% if logging_settings['offset']['direction']=='+' and not
                                        logging_settings['offset']['amount']==0 %} selected {% endif %}>+</option>
                                </select>
                                <label for="dir_offset">Direction</label>
                            </div>
                            <div class="input-field col s6 m6">
                                <select name="time_offset" id="">
                                    {% for i in range(0,15) %}
                                    <option value="{{i}}" {% if logging_settings['offset']['amount']==loop.index-1 %}
                                        selected {% endif %}>{{i}}</option>
                                    {% endfor %}
                                </select>
                                <label for="time_offset">Time Offset</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="input-field col s12 m4 center"></div>
                            <div class="input-field col s12 m4 center">
                                <input type="hidden" name="time_offset_update">
                                <button class="btn waves-effect waves-light col s12">
                                    <i class="material-icons"></i> Update
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="col s12 m2"></div>
        </div>
    </div>
</section>
{% endblock %}